<template>
  <view>
    <view
    v-for="(node, index) in content.nodes"
    >
      <view
      v-if="node.type === 'text'"
      :key="index"
      class="text-view"
      :style="{textAlign: node.align}"
      >{{node.value}}</view>

      <image
      v-if="node.type === 'fileIdOfImage'"
      :key="index"
      class="image"
      mode="widthFix"
      :src="file.visit(node.value)"
      ></image>
    </view>
  </view>
</template>

<script>
import file from "../../libs/file";
export default {
  data() {
    return {
      file,
      content:{
        nodes: [{
          type:"fileIdOfImage",
          value: "525566399025157"
        },
          {
            type:"text",
            value:"这是一段富文本",
            align:"left"
          }
        ]
      }
    };
  }
}
</script>

<style lang="scss" scoped>
.text-view {
  font-size: 32rpx;
  color: #333333;
  margin-bottom: 20rpx;
  text-align: center;
}

.image {
  width: 100%;
}

</style>
